import React from 'react'
import {
  ScrollView,
  StyleSheet,
  TextInput,
  View,
  useWindowDimensions
} from 'react-native'
import Logo from './Logo'
import tw from 'twrnc';
import { useAuthService } from '@/modules/auth/useAuthService';
import { MD5 } from 'crypto-js';
import { Button } from '@/components/Button';
import { lightColors } from '@/helpers/colors';
import AppTheme from '@/theme';


function SignIn() {
  const { width } = useWindowDimensions();


  const { loading, error, handleFinish, disabled } = useAuthService();

  const [userName, setUserName] = React.useState("");
  const [passWord, setPassWord] = React.useState("");

  const onLogin = () => {
    handleFinish({
      username: userName,
      password: MD5(passWord).toString()
    })
  }




  return (
    <View style={{ ...styles.bg }}>
      <ScrollView contentContainerStyle={tw`flex-1 justify-center items-center`}>
        <Logo />

        <TextInput
          value={userName}
          onChangeText={(e) => {
            setUserName(e)
          }}
          style={{ ...styles.input, width: width / 1.2 }}
          placeholder='您的用户名' />

        <TextInput
          value={passWord}
          secureTextEntry
          onChangeText={(e: string) => {
            setPassWord(e)
          }}
          style={{ ...styles.input, width: width / 1.2 }}
          placeholder='您的密码' />

        <Button
          title='登录'
          onPress={onLogin}
          loading={loading}
          containerStyle={{
            width: width / 1.2,
            borderRadius: 99999
          }}
          color={AppTheme.colors.blue}
          disabledStyle={{
            backgroundColor: AppTheme.colors.gray500
          }}
          disabled={disabled} />
      </ScrollView>
    </View>
  )
}



const styles = StyleSheet.create({
  bg: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center'
  },
  input: {
    borderWidth: 1,
    borderColor: 'rgb(7,88,218)',
    borderRadius: 99999,
    textAlign: 'center',
    marginBottom: 14,
    letterSpacing: 3,
  }
})

export default SignIn